<template>
  <div class="infoorder">
    <div>
      <el-input
        style="width: 300px"
        v-model="RentId"
        placeholder="请输入订单号"
      ></el-input>
      <el-button type="primary" @click="findRentId" style="margin-left: 20px"
        >查询</el-button
      >
    </div>

    <!-- 表单 -->
    <div style="margin-top: 20px;">
      <el-row>
        <el-col :span="20" :offset="2">
          <el-table :data="tablecCourse" border style="width: 100%;">
            <el-table-column
              prop="rentMessageId"
              label="订单号"
            ></el-table-column>
            <el-table-column prop="rentype" label="计费方式"></el-table-column>
            <el-table-column
              prop="rentStartTime"
              label="开始时间"
            ></el-table-column>
            <el-table-column
              prop="rentEndTime"
              label="结束时间"
            ></el-table-column>
            <el-table-column
              prop="parkingSpaceAddr"
              label="车位地点"
            ></el-table-column>
            <el-table-column
              prop="propertyName"
              label="所属物业"
            ></el-table-column>
            <el-table-column prop="status" label="订单状态"></el-table-column>
            <el-table-column prop="cost" label="消费金额"></el-table-column>
            <el-table-column
              prop="rowAddTime"
              label="下单时间"
            ></el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <!-- 分页 -->
        <el-pagination
    background
    
    layout="prev, pager, next"
    :total="pageData.total"
    :page-size="pageData.size"
    :current-page="pageData.current"
    @current-change="handleChange"
    >
    </el-pagination>


    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
    pageData:{
                total:0,
                size:3,
                current:1
           },
      RentId: "",
      tablecCourse: [
        {
          rentMessageId: "",
          rentype: "",
          rentStartTime: "",
          rentEndTime: "",
          parkingSpaceAddr: "",
          propertyName: "",
          status: "",
          cost: "",
          rowAddTime: "",
        },
      ],
    };
  },
  methods: {
    findRentId() {
        this.$http.get("/findRentId",{
          params: {
            rentMessageId:this.RentId
          }
        })
        .then(response => {
             console.log(response);
          this.tablecCourse=response.data.data
        })
    },
    findAll(){
      this.$http.get("/findRent",{
        params: {
           current:this.pageData.current,
           lessorId:localStorage.getItem("loginUser")
        }
      })
      .then(response => {
         console.log(response);
    
        Object.assign(this.pageData,response.data.data)
      
          this.tablecCourse=response.data.data.records;
      })
      .catch(error => {
        console.log(error);
      })
    },
      handleChange(data){
            console.log(data);
            this.pageData.current = data,
            this.findAll();
          
        }
   
  },


  mounted(){
    this.findAll();
  }
};
</script>
